import {Component, OnInit} from '@angular/core';
import {FormArray, FormControl, FormGroup} from '@angular/forms';

@Component({
  selector: 'app-reactive-form',
  templateUrl: './reactive-form.component.html',
  styleUrls: ['./reactive-form.component.css']
})
export class ReactiveFormComponent implements OnInit {


  /*一组FormControl组成 其中一个无效 所有的值都无效*/
  formModel: FormGroup = new FormGroup({
    username: new FormControl('xxxx'),
    /*rangDate对应html formGroup的值*/
    rangDate: new FormGroup({
      from: new FormControl(),
      to: new FormControl()
    }),
    /*可变长度集合，序号访问对应的值*/
    emails: new FormArray([
      new FormControl('AA'),
      new FormControl('cc'),
      new FormControl('sds'),
      new FormControl('adfa')
    ])
  });

  sdfas: string[];

  constructor() {
  }

  ngOnInit() {
  }

  onSubmit() {
    console.log(this.formModel.value);
  }

  addEamil() {
    let emails = this.formModel.get('emails') as FormArray;
    emails.push(new FormControl());
  }

}
